//@flow

/**
 * 测试 redux 用视图
 */

import React, { Component } from 'react';
import { 
    View,
    Button,
    Text,
 } from 'react-native';
import { connect } from "react-redux";
import * as action from "./counter.action";
import { store } from "../index";
type Props = {
    value	:number,
    onAdd   :()=>{},
    onReduce:()=>{},
}

class Counter extends Component <Props,{}> {
    render(){
        return (
            <View>
                <Text>-{this.props.value}-</Text>
                <Button title="add" onPress={()=>{this.props.onAdd()}}>add</Button>
                <Button title="reduce" onPress={this.props.onReduce}>reduce</Button>
            </View>
        )
    }
}

const mapStateToProps = (state,ownProps)=>{
    return {
        value : state.counterReducer.value
    }
}

const mapDispatchToProps = dispatch=>{
    console.log(`\nargs\n`)
    console.log(arguments)
    return {
        onAdd : ()=>dispatch(action.onAdd()),
        onReduce:()=>dispatch(action.onReduce())
    }
}

Counter = connect(mapStateToProps,mapDispatchToProps)(Counter)
export {Counter};